//
// Tables
// --------------------------------------------------


// BASE TABLES
// -----------------

table {
	max-width: 100%;
	background-color: @tableBackground;
	border-collapse: collapse;
	border-spacing: 0;
}

// BASELINE STYLES
// ---------------

.table {
	width: 100%;
	margin-bottom: @baseLineHeight;
	font-size: 85%; // Ex: 14px base font * 85% = about 12px
	border-bottom: 1px solid @tableHeaderText;

	// Cells
	th,
	td {
		padding: 8px;
		line-height: @baseLineHeight;
		text-align: left;
		vertical-align: top;
		border-top: 1px solid @tableBorder;
	}

	th {
		font-weight: bold;
	}
	// Bottom align for column headings
	thead th {
		vertical-align: bottom;
		text-transform: uppercase;
		color: @tableHeaderText;
		border-bottom: 3px solid @tableHeaderBorder;
	}
	// Remove top border from thead by default
	caption + thead tr:first-child th,
	caption + thead tr:first-child td,
	colgroup + thead tr:first-child th,
	colgroup + thead tr:first-child td,
	thead:first-child tr:first-child th,
	thead:first-child tr:first-child td {
		border-top: 0;
	}
	// Account for multiple tbody instances
	tbody + tbody {
		border-top: 2px solid @tableBorder;
	}
}



// CONDENSED TABLE W/ HALF PADDING
// -------------------------------

.table-condensed {
	th,
	td {
		padding: 4px 5px;
	}
}


// BORDERED VERSION
// ----------------

.table-bordered {
	border: 1px solid;
	border-collapse: separate; // Done so we can round those corners!
	*border-collapse: collapse; // IE7 can't round corners anyway
	border-left: 0;
	border-top-color:  @tableBorder;
	border-left-color:  @tableBorder;
	border-right-color:  @tableBorder;

	th,
	td {
		border-left: 1px solid @tableBorder;
	}
	// Prevent a double border
	caption + thead tr:first-child th,
	caption + tbody tr:first-child th,
	caption + tbody tr:first-child td,
	colgroup + thead tr:first-child th,
	colgroup + tbody tr:first-child th,
	colgroup + tbody tr:first-child td,
	thead:first-child tr:first-child th,
	tbody:first-child tr:first-child th,
	tbody:first-child tr:first-child td {
		border-top: 0;
	}
}




// ZEBRA-STRIPING
// --------------

// Default zebra-stripe styles (alternating gray and transparent backgrounds)
.table-striped {
	tbody {
		tr:nth-child(odd) td,
		tr:nth-child(odd) th {
			background-color: @tableBackgroundAccent;
		}
	}
}


// HOVER EFFECT
// ------------
// Placed here since it has to come after the potential zebra striping
.table-hover {
	tbody {
		tr:hover td,
		tr:hover th {
			background-color: @tableBackgroundHover;
		}
	}
}


// TABLE CELL SIZING
// -----------------

// Reset default grid behavior
table [class*=span],
.row-fluid table [class*=span] {
	display: table-cell;
	float: none; // undo default grid column styles
	margin-left: 0; // undo default grid column styles
}

// Change the column widths to account for td/th padding
.table {
	.span1 {
		.tableColumns(1);
	}

	.span2 {
		.tableColumns(2);
	}

	.span3 {
		.tableColumns(3);
	}

	.span4 {
		.tableColumns(4);
	}

	.span5 {
		.tableColumns(5);
	}

	.span6 {
		.tableColumns(6);
	}

	.span7 {
		.tableColumns(7);
	}

	.span8 {
		.tableColumns(8);
	}

	.span9 {
		.tableColumns(9);
	}

	.span10 {
		.tableColumns(10);
	}

	.span11 {
		.tableColumns(11);
	}

	.span12 {
		.tableColumns(12);
	}

	.span13 {
		.tableColumns(13);
	}

	.span14 {
		.tableColumns(14);
	}

	.span15 {
		.tableColumns(15);
	}

	.span16 {
		.tableColumns(16);
	}

	.span17 {
		.tableColumns(17);
	}

	.span18 {
		.tableColumns(18);
	}

	.span19 {
		.tableColumns(19);
	}

	.span20 {
		.tableColumns(20);
	}

	.span21 {
		.tableColumns(21);
	}

	.span22 {
		.tableColumns(22);
	}

	.span23 {
		.tableColumns(23);
	}

	.span24 {
		.tableColumns(24);
	}
}
